<!-- Docs page layout -->
<div class="" id="index">
    <div class="jumbotron masthead">
        <div class="container">
            <h1>Joggle</h1>
            <h2 class="site-title" ng-bind="res.t('home.banner.title')"></h2>
            <p class="masthead-button-links">
                <a class="btn btn-lg btn-primary btn-shadow" href="#/document" >立即阅读Joggle文档</a>
            </p>
            <p class="masthead-links">
                <a >免费、开源、多租户、多协议支持、跨平台</a>
            </p>
        </div>
    </div>


    <div class="container">
        <div class="row">
            <div class="col-md-2 col-sm-6">
                <div class="counter">
                    <div class="counter-content">
                        <span class="counter-value" ng-bind="countInfo.userNum">0</span>
                        <h3 class="title">用户</h3>
                    </div>
                </div>
            </div>

            <div class="col-md-2 col-sm-6">
                <div class="counter">
                    <div class="counter-content">
                        <span class="counter-value" ng-bind="countInfo.deviceNum">0</span>
                        <h3 class="title">设备</h3>
                    </div>
                </div>
            </div>

            <div class="col-md-2 col-sm-6">
                <div class="counter">
                    <div class="counter-content">
                        <span class="counter-value" ng-bind="countInfo.deviceOnlineNum">0</span>
                        <h3 class="title">在线设备</h3>
                    </div>
                </div>
            </div>

            <div class="col-md-2 col-sm-6">
                <div class="counter">
                    <div class="counter-content">
                        <span class="counter-value" ng-bind="countInfo.domainNum">0</span>
                        <h3 class="title">域名</h3>
                    </div>
                </div>
            </div>
            <div class="col-md-2 col-sm-6">
                <div class="counter">
                    <div class="counter-content">
                        <span class="counter-value" ng-bind="countInfo.portNum">0</span>
                        <h3 class="title">端口</h3>
                    </div>
                </div>
            </div>

            <div class="col-md-2 col-sm-6">
                <div class="counter">
                    <div class="counter-content">
                        <span class="counter-value" ng-bind="countInfo.tunnelNum">0</span>
                        <h3 class="title">通道</h3>
                    </div>
                </div>
            </div>
        </div>

        <hr class="half-rule">
    </div>


    <div class="container index-textcenter">
        <h2 class="index-bullet-title">什么是Joggle？</h2>
        <p class="lead">Joggle 是一个款云端管理的内网穿透互联网应用。能够帮助用户快速的将内网应用映射到公网，帮助开发者实现穿透内网调试应用，网站程序映射到公网、映射RDP远程桌面链接家里PC电脑等等，能实现轻量级的网站应用映射。
            <br/>实现这一切您只需要在您的电脑或者低功耗设备部署Joggle客户端即可。
        </p>
        <img src="./resource/images/register/register.jpg" style="width: 100%; margin-top:3em" />
        <br/>
        <br/>
        <hr class="half-rule">

        <div class="row index-textcenter">
            <div class="col-sm-3">
                <div class="index-icon">
                    <img src="./resource/images/icon/icon1.png" alt="Joggle support" class="img-responsive">
                </div>
                <h3>免费、开源</h3>
                <p>github/gitee下载最新的源代码</p>
            </div>
            <div class="col-sm-3">
                <div class="index-icon">
                    <img src="./resource/images/icon/icon2.png" alt="Responsive across devices" class="img-responsive">
                </div>
                <h3>灵活配置</h3>
                <p>提供强大图形界面配置</p>
            </div>
            <div class="col-sm-3">
                <div class="index-icon">
                    <img src="./resource/images/icon/icon3.png" alt="Components" class="img-responsive">
                </div>
                <h3>多平台支持</h3>
                <p>市面主流操作系统</p>
            </div>
            <div class="col-sm-3">
                <div class="index-icon">
                    <img src="./resource/images/icon/icon4.png" alt="Components" class="img-responsive">
                </div>
                <h3>多协议支持</h3>
                <p>支持TCP、UDP、HTTP、HTTPS等协议</p>
            </div>
        </div>

        <hr class="half-rule">

        <p class="lead">Joggle是完全开源的，它的代码托管、开发、维护都依赖 GitHub/GitEE 平台。</p>
        <a href="https://github.com/wuweiit/Bullet" target="_blank" class="btn btn-outline btn-lg">查看 GitHub 项目主页</a>
        <a href="https://gitee.com/marker/bullet" target="_blank" class="btn btn-outline btn-lg">查看 GitEE 项目主页</a>
    </div>



  <div class="container">






    <p>
<!--    	<a href="#/user/device" ng-show="user" class="btn btn-default" ng-bind="res.t('home.btn.device')"></a>-->
<!--    	<a href="#/user/domain" ng-show="user" class="btn btn-default" ng-bind="res.t('home.btn.domain')"></a>-->
    	<!--<a href="#/flashchat/index" class="btn btn-default" ng-bind="res.t('home.btn.flashchat')"></a>-->
    	<!--<a href="#/wishwall/build" class="btn btn-default" ng-bind="res.t('home.btn.wishwall')"></a>-->
        <!--<a href="#/app/video/index" class="btn btn-default" ng-bind="res.t('home.btn.onlinevideo')"></a>-->


      <!--<a href="#/user/device" class="btn btn-default" ng-bind="res.t('home.btn.download')"></a>-->
    </p>
  </div>
</div>

